<template>
<view class="page"> 
	<template>
		<view class="h45">
			<view class="fix-wrap">
				<view class="h45 search-bar">
					<view class="search-form">
						<view class="icon sc-icon iconfont icon-sousuo"></view>
						<input type="text" v-model="keyword" class="sc-inp"  placeholder="输入关键词搜索" @confirm="search">
						<view v-if="keyword" class="icon clear-btn iconfont icon-shanchu" @click="clearKeyword"></view>
					</view>
				</view> 
			</view>
		</view>
		<view class="body">
			<template v-if="type==1">
				<view class="list-wrap">				
					<template >
						<template v-if="list.length>0"> 		 
							<navigator :url="'/pages/detail/detail?type='+type+'&id='+item.id" hover-class="none" class="item" v-for="(item,index) in list" :key="index"> 
								<view class="info">								
									<view class="params m-r2"> 
										<view class="text">{{item.create_time}}</view> 
									</view>
									<view class="name">{{item.title}}</view>
								</view>
							</navigator> 
							
							<c-loading :loadingState="loadingState"></c-loading>
						</template>
						<template v-else>
							<c-empty msg="暂无信息"></c-empty>
						</template>						
					</template>					
				</view>
			</template>
			
			<template v-if="type==2">
				<view class="list-wrap">				
					<template >
						<template v-if="list.length>0"> 		 
							<navigator :url="'/pages/detail/detail?type='+type+'&id='+item.id" hover-class="none" class="item" v-for="(item,index) in list" :key="index"> 
								<view class="info">								
									<view class="params m-r2"> 
										<view class="text">{{item.create_time}}</view> 
									</view>
									<view class="name">{{item.name}}</view>
								</view>
							</navigator> 
							
							<c-loading :loadingState="loadingState"></c-loading>
						</template>
						<template v-else>
							<c-empty msg="暂无信息"></c-empty>
						</template>
						
					</template>					
				</view>
			</template>
		</view>
		  
	</template>
	  
</view>
</template>

<script> 
 
import {HTTP_REQUEST_URL} from '@/config.js'
export default{
	name:'demo',
	data(){
		return{ 
			isLogin:false,
			userInfo:uni.getStorageSync('userInfo'), 
			loadingState:{
				default:true,
				loading:false,
				compelted:false
			}, 
			list:[], 
			page:1,
			total:0, 
			keyword:'',
			http_request_url:HTTP_REQUEST_URL,
			type:1
		}
	},
	onShow() {
		
	},
	onReachBottom(){
		if(this.loadingState.completed){ 
			this.page=1;
			return false
		}else{
			if(this.list.length<this.total&&this.list.length>0){
				this.page++; 
				if(this.type==1){
					this.fkinfolist();  
				}else if(this.type==2){
					this.basicmonitorlist();
				}
			} 
		}	 
	},
	async onLoad(params) { 
		this.type=params.type;
		if(this.type==1){
			this.fkinfolist();  
		}else if(this.type==2){
			this.basicmonitorlist();
		}
		
		 
		
	},
	methods:{
		
		dataInit:function(){
			this.loadingState={
				default:true,
				loading:false,
				compelted:false
			};  
			this.list=[];
			this.total=0;
			this.page=1;
		},
		
		// 获取列表
		fkinfolist:async function(){
			let res=await this.$api.user_api.fkinfolist({				 
				page: this.page,
				limit: 20,
				keywords: this.keyword
			})     
			if(res.data.ret==1000){
				// this.loadingState.default=false;
				// this.loadingState.loading=true;
				this.total=res.data.data.count;
				this.list=this.list.concat(res.data.data.list);
				if(this.list.length==this.total){ 
					this.loadingState.loading=false;
					this.loadingState.completed=true;
				}
			}else{
				this.loadingState.default=false;
			}
			 
		},
		
		// 获取列表
		basicmonitorlist:async function(){
			let res=await this.$api.user_api.basicmonitorlist({				 
				page: this.page,
				limit: 20,
				keywords: this.keyword
			})     
			if(res.data.ret==1000){
				// this.loadingState.default=false;
				// this.loadingState.loading=true;
				this.total=res.data.data.count;
				this.list=this.list.concat(res.data.data.list);
				if(this.list.length==this.total){ 
					this.loadingState.loading=false;
					this.loadingState.completed=true;
				}
			}else{
				this.loadingState.default=false;
			}
			 
		},
		 
		
		// 清空搜索词
		clearKeyword:function(){
			this.keyword='';
			this.dataInit(); 
			if(this.type==1){
				this.fkinfolist();  
			}else if(this.type==2){
				this.basicmonitorlist();
			}
		},
		
		 
		// 搜索
		search:function(){
			this.dataInit();
			if(this.type==1){
				this.fkinfolist();  
			}else if(this.type==2){
				this.basicmonitorlist();
			}
		},
	},
	computed:{
		// list_update(){  
		// 	return this.$store.state.diaochaListUpdate
		// }
	},
	watch:{
		// list_update(newer,older){ 
		// 	if(newer!=older){
		// 		this.loadingState={
		// 			default:true,
		// 			loading:false,
		// 			compelted:false
		// 		};
		// 		this.list=[];
		// 		this.getPcDataList();
		// 	}
		// }
	},
	components:{
		 
	}
}
</script>

<style scoped lang="less">
	.page{
		height: 100%;
	}
	.list-wrap{
		padding-top: 20rpx;
		.item{ 
			display: flex;
			padding:20rpx;
			margin-bottom: 20rpx;
			background:#fff; 
			.info{
				display: flex;
				flex-grow: 2;
				.name{
					margin-bottom: 10rpx;
					font-size: 32rpx;
				}
				.params{
					font-size:30rpx;
					color:#999;
					.text{
						margin-bottom:8rpx;
					}
				}
			}
		}
	}
	
	.add-yj-btn{ 
		width: 96%;
		height:80rpx;
		margin:10rpx auto;
		background: #f00;
		border-radius: 10rpx;
		text-align: center;
		line-height:80rpx;
		color:#fff;
		font-size:32rpx;
	}
</style>
